<template>
  <TableAdd v-model="data" :mainKey="config[type].mainKey" :options="config[type].options" :columns="config[type].columns" :title="config[type].title" />
</template>

<script lang="jsx" setup>
import TableAdd from './TableAdd'
const props = defineProps({
  modelValue: { type: Object, default: () => ({}) },
  type: { type: String, default: 'vat' },
  options: { type: Object, default: () => ({}) },
})
const emit = defineEmits(['update:modelValue'])

const config = {
  vat: {
    mainKey: 'vat_id',
    title: 'VAT税号',
    options: props.options.vat.map(d => ({ ...d, label: d.vat_num, value: d.vat_id })),
    columns: [
      {title: '站点', field: 'bank_name', minWidth: 100, slots: {
        header: ()=> <div><span class="text-red-600">*</span>站点</div>,
        default: ({row}) => <VSelect v-model={row.site_id} placeholder="请选择" options={props.options.site} filterable clearable class="w-full" />
      }},
      {title: 'VAT税号', field: 'vat_num', minWidth: 200},
      {title: 'VAT证书日期', field: 'vat_certificate_date', minWidth: 150},
      {title: '本地税号', field: 'german_local_tax_num', minWidth: 100},
      {title: 'EORI', field: 'eu_eori_num', minWidth: 100},
    ]
  },
  credit: {
    mainKey: 'card_id',
    title: '卡号',
    options: props.options.credit_card.map(d => ({ ...d, label: d.card_number, value: d.card_id })),
    columns: [
      {title: '开卡银行', field: 'bank_name', minWidth: 100},
      {title: '卡号', field: 'card_number', minWidth: 200},
      {title: '安全码', field: 'security_code', minWidth: 200},
      {title: '姓名', field: 'name', minWidth: 100},
      {title: '有效期', field: 'validity_data', minWidth: 150},
      {title: '通知注销日期', field: 'cancel_data', minWidth: 150},
    ]
  },
  collect: {
    mainKey: 'card_id',
    title: '收款方式',
    options: props.options.collect_card.map(d => ({ ...d, label: d.collect_type, value: d.card_id })),
    columns: [
      {title: '收款方式', field: 'collect_type', minWidth: 100},
      {title: '收款ID', field: 'receivables_id', minWidth: 200},
      {title: '收款账号', field: 'receivables_account', minWidth: 100},
      {title: '收款币种', field: 'receivables_currency', minWidth: 150},
    ]
  },
  epr: {
    mainKey: 'epr_id',
    title: '证书ID',
    options: props.options.epr.map(d => ({ ...d, label: d.epr_name, value: d.epr_id })),
    columns: [
      {title: '证书ID', field: 'certificate_id', minWidth: 100},
      {title: '公司', field: 'company_name_ch', minWidth: 100, line: 2},
      {title: 'EPR项目', field: 'erp_project_name', minWidth: 120},
      {title: '类别', field: 'category', minWidth: 100},
      {title: '品牌', field: 'brand_name', minWidth: 100},
      {title: '代理/办理机构', field: 'agency', minWidth: 120, line: 2},
      {title: '生效日期', field: 'effective_date', minWidth: 100},
    ]
  },
}

const data = computed({
  get() {
    return props.modelValue
  },
  set(val) {
    emit('update:modelValue', val)
  }
})

</script>